<!-- header -->
<div class="form-group clearfix ">
  <div class="form-inline pull-right">
    <input class="form-control" placeholder="一级类目名称" name="title" [(ngModel)]="searchData">
    <button class="btn btn-default" (click)="search()">搜索</button>
    <button class="btn btn-default" (click)="reset()">重置</button>
  </div>
</div>

<!-- body -->
<div>类目绑定属性分类</div>
<div class="mt20">
  <table class="table">
    <thead>
    <tr>
      <th>一级类目</th>
      <th>已绑定属性分类</th>
      <th>备注</th>
      <th>操作</th>
    </tr>
    </thead>
    <tbody>
      <tr *ngFor="let item of firLevel">
        <td>{{item.name}}</td>
        <td>{{!!item.goods_attribute_category.length?item.goods_attribute_category[0].name:''}}</td>
        <td>{{!!item.goods_attribute_category.length?item.goods_attribute_category[0].remark:''}}</td>
        <td>
          <a href="javascript:;" *ngIf="!item.goods_attribute_category.length" (click)="addClassify(item.id)">添加</a>
          <a href="javascript:;" *ngIf="!!item.goods_attribute_category.length"
             (click)="editClassify(item.id,item.goods_attribute_category[0].id,item.goods_attribute_category[0].name,item.goods_attribute_category[0].remark)">编辑</a>
          <a href="javascript:;" *ngIf="!!item.goods_attribute_category.length" (click)="delClassify(item.goods_attribute_category[0].id)">删除</a>
        </td>
      </tr>
    </tbody>
  </table>
  <div class="text-center">
    <pagination (pageChanged)="pageChanged($event)" [totalItems]="totalItems" [itemsPerPage]="itemsPerPage" [(ngModel)]="currentPage" [maxSize]="5"
                previousText="&lsaquo;" nextText="&rsaquo;" firstText="&laquo;" lastText="&raquo;" [boundaryLinks]="true" class="pagination-sm"></pagination>
  </div>
</div>

<app-notification [type]="type" [message]="message" [isShow]="isShow" (promptIsShow)="promptIsShow($event)"></app-notification>

<!-- 编辑弹框 -->
<div class="modal fade" bsModal #editModal="bs-modal" tabindex="-1">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title pull-left">新增模块</h4>
        <button type="button" class="close pull-right" aria-label="Close" (click)="editModal.hide()">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <form>
          <div class="form-group clearfix">
            <label class="col-md-2">分类名称</label>
            <div class="col-md-6">
              <input type="text" class="form-control" name="classifyName" [(ngModel)]="classifyName">
            </div>
          </div>
          <div class="form-group clearfix">
            <label class="col-md-2">备注</label>
            <div class="col-md-6">
              <input type="text" class="form-control" name="remark" [(ngModel)]="remark">
            </div>
          </div>
          <div class="text-center mt20">
            <button class="btn btn-default btn-md-long" type="button" (click)="editModal.hide()">取消</button>
            <button class="btn btn-success btn-md-long" type="submit" (click)="addClassifySubmit()">确定</button>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>
<!-- 是否确认删除弹框 -->
<div class="modal fade" bsModal #delModal="bs-modal" tabindex="-1">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title pull-left">提示</h4>
        <button type="button" class="close pull-right" aria-label="Close" (click)="delModal.hide()">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body text-center">
        是否确认删除
      </div>
      <div class="modal-footer mt20">
        <button class="btn btn-default btn-md-long" type="button" (click)="delModal.hide()">取消</button>
        <button class="btn btn-success btn-md-long" type="submit" (click)="delClassifySubmit()">确定</button>
      </div>
    </div>
  </div>
</div>
